<script setup lang="ts">

const option = {
  color: ['#2c95ff', '#20d2ff', '#ffffff'],
  tooltip: {
    trigger: 'item',
  },
  legend: {
    top: '5%',
    left: 'center',
  },
  series: [
    {
      name: 'Access From',
      type: 'pie',
      radius: ['40%', '70%'],
      avoidLabelOverlap: false,
      label: {
        show: false,
        position: 'center',
      },
      // emphasis: {
      //   label: {
      //     show: true,
      //     fontSize: '40',
      //     fontWeight: 'bold',
      //   },
      // },
      labelLine: {
        show: false,
      },
      data: [
        {
          name: '分类一',
          value: 30,
        },
        {
          name: '分类二',
          value: 20,
        },
        {
          name: '分类三',
          value: 10,
        },
      ],
    },
  ],
};
</script>

<template>
  <v-chart
    class="chart"
    :option="option"
    autoresize
  />
</template>

<style scoped>
</style>
